<template>
  <view class="white-bg">
    <view>
      <u-image src="@img/banner.png" height="320rpx" width="100%"></u-image>
    </view>
    <view
      class="text-center font-size-[30rpx] color-[#3c9cff] my-[64rpx] fw-500"
      >欢迎登录</view
    >
    <view class="mx-[48rpx]">
      <view class="m-t-[32rpx]">
        <u-input
          v-model="phone"
          border="bottom"
          maxlength="11"
          placeholder="请输入手机号码"></u-input>
      </view>
      <view class="mt-[32rpx]">
        <u-input
          v-model="password"
          border="bottom"
          type="password"
          placeholder="请输入密码"></u-input>
      </view>
      <view class="mt-[50rpx] u-flex-y-center">
        <view>
          <u-checkbox-group v-model="isRead">
            <u-checkbox
              :customStyle="{ marginRight: '8px' }"
              :key="index"
              activeColor="#FF8F44"
              :name="true"
              shape="circle"
              label="阅读并同意以下协议">
            </u-checkbox>
          </u-checkbox-group>
        </view>
        <view class="color-[#3c9cff] font-size-[24rpx]">《用户服务协议》</view>
      </view>
      <view class="mt-[46rpx]">
        <u-button
          @click="accountLogin"
          type="primary"
          :custom-style="{ height: '96rpx', fontSize: '32rpx' }"
          >登录</u-button
        >
      </view>
      <view class="mt-[32rpx]">
        <u-button
          type="primary"
          color="#f5f5f5"
          :custom-style="{
            height: '96rpx',
            color: '#3c9cff',
            fontSize: '32rpx',
          }"
          @click="$u.route('/pages/register/index')"
          >新用户注册</u-button
        >
      </view>
      <view class="u-flex-x-center">
        <view class="other-way">
          <u-divider
            text="快捷登录"
            textColor="#999"
            textSize="24rpx"
            lineColor="#999"></u-divider>
        </view>
      </view>
      <view class="u-m-t-32 u-p-b-50 u-flex-x-center" @click="wxLogin">
        <u-image
          src="https://tse4-mm.cn.bing.net/th/id/OIP-C.rS4xoKVc8ppdb3jnvHdEWAHaG-?w=194&h=183&c=7&r=0&o=5&pid=1.7"
          height="112rpx"
          width="112rpx"></u-image>
      </view>
    </view>
  </view>
</template>

<script setup>
// 表单
let phone = ref("");
let password = ref("");
let isRead = ref([]);
const accountLogin = () => {
  uni.$sc.toast("登录成功").then(() => {
    uni.$u.route("/pages/index/index");
  });
};
</script>

<style lang="scss" scoped>
page {
  background-color: #fff;
}
</style>
